Dynamic Account Group Documentation

HTML Select Elements Setup

The Account Type (Head) dropdown has the class ._account_head_id. When a user changes the value of this field, it acts as the trigger. The target element that will be updated has the class ._account_groups.

Code Snippet (create.blade.php):

<!-- Trigger Source: Account Head Select -->
<select class="form-control _account_head_id" name="_account_head_id" type_base_group="{{ url('type_base_group') }}" required>
    <option value="">--Select Account Type--</option>
    @forelse($account_types as $account_type)
        <option value="{{ $account_type->id }}">{{ $account_type->_name }}</option>
    @empty
    @endforelse
</select>

<!-- Target Output: Account Group Select -->
<select class="form-control _account_groups" name="_account_group_id" required>
    <option value="">--Select Account Group--</option>
</select>

jQuery Event Listener & AJAX Call

In main.js, an event listener is attached to the ._account_head_id dropdown. When an option is selected, the script retrieves the selected ID and fires an AJAX GET request to the base URL appended with type_base_group.

$(document).on("change", "._account_head_id", function() {
    var _account_head_id = $(this).val();
    var action_url = project_base_url + "/type_base_group";
    
    var request = $.ajax({
        url: action_url,
        method: "GET",
        data: { id : _account_head_id },
        dataType: "html"
    });
    
    request.done(function( msg ) {
        // Injects the dynamically compiled HTML into the Account Group dropdown
        $(document).find("._account_groups").html( msg );
    });
});

Controller Logic & Database Retrieval

The GET request hits the type_base_group route which calls the type_base_group() method in AccountLedgerController.php. This queries the account_groups database table using the AccountGroup Eloquent model.

It fetches all groups that match the passed _account_head_id (which comes through as $request->id).

public function type_base_group(Request $request) {
    // Filter groups based on the account head ID securely
    $account_groups = AccountGroup::where('_account_head_id', $request->id)
                                    ->orderBy('_name', 'asc')
                                    ->get();
                                    
    // Passes the data to a dedicated partial view
    return view('backend.account-ledger.type_base_group', compact('account_groups'));
}

HTML Rendering & Injection

The data is injected into the type_base_group.blade.php file which iterates over the retrieved collection and creates a stream of <option> HTML elements. Finally, this raw HTML template is returned as a string to the AJAX success callback, replacing the existing Account Group dropdown elements.

<option value="">--Select Account Group--</option>
@forelse($account_groups as $account_group)
    <option value="{{ $account_group->id }}">
        {{ $account_group->id }} - {{ $account_group->_name }}
    </option>
@empty
    <!-- Handles cases with no groups -->
@endforelse